<template>
  <div>
    <el-form :rules="rules" ref="searchFormRef" size="mini" :inline="true">
      <div>
        <el-tooltip
          class="item"
          effect="dark"
          content="输入需要查看的数据分析时间段内容"
          placement="bottom"
        >
          <i
            style="line-height: 1.8"
            class="el-icon-question"
            color="#555555"
          ></i>
        </el-tooltip>

        <el-form-item label="税款日期起止" prop="taxPeriodStartTime">
          <el-date-picker
            v-model="value1"
            type="monthrange"
            range-separator="-"
            start-placeholder="开始月份"
            end-placeholder="结束月份"
            value-format="yyyy-MM"
            :picker-options="pickerOptions"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="mini" @click="searchList"
            >查询</el-button
          >
        </el-form-item>
      </div>
    </el-form>
    <el-table
      :span-method="arraySpanMethod"
      :data="tableData"
      border
      style="width: 100%"
      :default-sort="{ prop: 'year', order: 'descending' }"
      v-loading="listLoading"
    >
      <el-table-column prop="year" label="月份"> </el-table-column>
      <el-table-column prop="1" label="1月"> </el-table-column>
      <el-table-column prop="2" label="2月"> </el-table-column>
      <el-table-column prop="3" label="3月"> </el-table-column>
      <el-table-column prop="4" label="4月"> </el-table-column>
      <el-table-column prop="5" label="5月"> </el-table-column>
      <el-table-column prop="6" label="6月"> </el-table-column>
      <el-table-column prop="7" label="7月"> </el-table-column>
      <el-table-column prop="8" label="8月"> </el-table-column>
      <el-table-column prop="9" label="9月"> </el-table-column>
      <el-table-column prop="10" label="10月"> </el-table-column>
      <el-table-column prop="11" label="11月"> </el-table-column>
      <el-table-column prop="12" label="12月"> </el-table-column>
      <el-table-column prop="total" label="合计"> </el-table-column>
      <el-table-column prop="amountSum" label="全部合计"> </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {
  getEnterpriseApplyAmount,
  getEnterprisePaidTaxesAmount
} from "../../../api/taxAnalysis";
export default {
  props: {
    currentId: {
      type: String,
      default: ""
    },

    taxname: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      name: "taxTable",
      pickerOptions: {
        shortcuts: [
          {
            text: "今年至今",
            onClick(picker) {
              const end = new Date();
              const start = new Date(new Date().getFullYear(), 0);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "去年",
            onClick(picker) {
              const date = new Date();
              const year = date.getFullYear();
              const end = new Date(year, 0, 0);
              const start = new Date(year - 1, 0, 1);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "前年",
            onClick(picker) {
              const date = new Date();
              const year = date.getFullYear();
              const end = new Date(year - 1, 0, 0);
              const start = new Date(year - 2, 0, 1);
              picker.$emit("pick", [start, end]);
            }
          }
        ],
        disabledDate(time) {
          // 获取三个自然年前的的第一天和当天
          const threeYearsAgo = new Date();
          threeYearsAgo.setFullYear(threeYearsAgo.getFullYear() - 2, 0, 1);
          threeYearsAgo.setHours(0, 0, 0, 0);

          const yesterday = new Date();
          yesterday.setDate(yesterday.getDate());
          yesterday.setHours(0, 0, 0, 0);

          // 比较日期是否在三年前的今天和昨天之外
          return (
            time.getTime() < threeYearsAgo.getTime() ||
            time.getTime() > yesterday.getTime()
          );
        }
      },

      //查询表单字段项
      rules: {},
      tableData: [],
      value1: "",

      listLoading: false
    };
  },

  created() {},
  methods: {
    showLoading() {
      this.listLoading = true;
    },

    hideLoading() {
      this.listLoading = false;
    },

    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 14) {
        return {
          rowspan: this.tableData.length,
          colspan: 1
        };
      }
    },

    searchList() {
      if (this.taxname == "amount") {
        let search = {
          enterpriseId: this.currentId,
          taxPeriodStartTime: "",
          taxPeriodEndTime: ""
        };
        if (this.value1) {
          search.taxPeriodStartTime = `${this.value1[0]}-01`;
          search.taxPeriodEndTime = this.getMonthDay(this.value1[1]);
        }
        this.listLoading = true;
        getEnterpriseApplyAmount(search)
          .then(res => {
            this.listLoading = false;
            this.ceatData(res, true);
          })
          .finally(() => {
            this.listLoading = false;
          });
      } else if (this.taxname == "taxpay") {
        let search = {
          enterpriseId: this.currentId,
          taxPeriodStart: "",
          taxPeriodEnd: ""
        };

        if (this.value1) {
          search.taxPeriodStart = `${this.value1[0]}-01`;
          search.taxPeriodEnd = this.getMonthDay(this.value1[1]);
        }

        this.listLoading = true;
        getEnterprisePaidTaxesAmount(search)
          .then(res => {
            this.listLoading = false;
            this.ceatData(res, true);
          })
          .finally(() => {
            this.listLoading = false;
          });
      }
    },

    getMonthDay(MonthData) {
      let new_year = MonthData.split("-")[0];
      let new_month = MonthData.split("-")[1]++;
      if (MonthData.split("-")[1] > 12) {
        new_month -= 12;
        new_year++;
      }
      let new_date = new Date(new_year, new_month, 1);
      return `${MonthData}-${new Date(
        new_date.getTime() - 1000 * 60 * 60 * 24
      ).getDate()}`;
    },

    ceatData(res, clear) {
      if (!clear) this.value1 = "";
      if (res.data.paidTaxesDataList.length === 0) {
        this.tableData = [];
        return;
      }

      let tableData = [];
      res.data.paidTaxesDataList.forEach(item => {
        let yeardata = {
          total: item.total,
          year: item.year
        };

        item.monthData.forEach(val => {
          yeardata[val.name] = val.value;
        });

        tableData.push(yeardata);
      });

      tableData[tableData.length - 1].amountSum = res.data.amountSum;
      this.tableData = tableData;
    }
  }
};
</script>
